
<template>
    <div class="tree" v-for="item in data">
        <input type="checkbox" v-model="item.checked"><span>{{ item.name }}</span>
<!--        <Tree v-if="item?.children?.length" :data="item?.children"></Tree>-->
        <trexxa v-if="item?.children?.length" :data="item?.children"></trexxa>
    </div>
</template>
<script setup lang="ts">
interface Tree {
    name: string,
    checked: boolean,
    children?: Tree[]
}
defineProps<{
    data?: Tree[]
}>()
</script>
<script lang="ts">
export  default {
    name: 'trexxa'
}
</script>

<style scoped lang="scss">
.tree {
    margin-left: 20px;
}
</style>
